<template>
  <div class="pc-game-container">
    <van-pull-refresh v-model="pullLoading" @refresh="onRefresh">
      <van-list v-model:loading="loading" @load="onLoad">
        <game-goods-list :GoodsListData="XboxGameData"></game-goods-list>
      </van-list>
    </van-pull-refresh>
  </div>
</template>

<script setup>
import GameGoodsList from '../../../components/gameGoodsItem/gameGoodsList.vue';

import { getXboxGoods } from '../../../network/gamestore'

import { ref, reactive, onMounted } from 'vue';

// 获取PC游戏数据
let XboxGameData = reactive([])
onMounted(() => {
  getXboxGoods().then(res => {
    console.log(res);
    XboxGameData.push(...res.data)
  })
})

// 上拉加载更多
const loading = ref(false);
const finished = ref(false);
const onLoad = () => {
  // 异步更新数据
  setTimeout(() => {
    getXboxGoods().then(res => {
      XboxGameData.push(...res.data)
      loading.value = false;
    })
    // 加载状态结束
  }, 1000);
};

// 下拉刷新
const pullLoading = ref(false)
const onRefresh = () => {
  setTimeout(() => {
    pullLoading.value = false
  }, 1000)
}
</script>

<style scoped>
</style>
